<template>
  <div class='search bc-white'>
    <p>
      <span :class="{pr:true,isActive:search.state==0}" @click="setState(0)">未审核</span>
      <span :class="{pr:true,isActive:search.state==1}" @click="setState(1)">已审核</span>
      <span class="class fr" @click="showAcheet">专业班级</span>
    </p>
  </div>
</template>
<script>
export default {
  props:["search","getListData","pageInfo","columnsData"],
  components: {},
  name: "",
  data() {
    return {};
  },
  methods: {
    setState(val){
      this.search.state=val
      this.pageInfo.page=1
      this.getSearch()
    },

    showAcheet(){
      this.$store.state.dias.acheet.show=true
      this.$store.state.dias.acheet.columns=this.columnsData
      this.$store.state.dias.acheet.confirm=this.confirm
    },
    confirm(val){
      this.$set(this.search,'classify',val)
      this.$store.state.dias.acheet.show=false
      this.pageInfo.page=1
      this.getSearch()
    },
    getSearch(){
     this.pageInfo.page=1
     this.getListData()
    },
  },
  created() {}
};
</script>
<style lang="scss" scoped>
.search {
  height: 80px;
  line-height: 80px;
  padding: 0 20px;
  box-sizing: border-box;
  border-bottom: 1px solid #ddd;

  p{
    // color: #00998d;
    
    span:nth-of-type(1){
      margin-right: 20px;
    }
    span.isActive,span.fr{
      color: #00998d;
    }
    .isActive:after{
      content:"";
      position: absolute;
      bottom: -3px;
      width: 100%;
      height: 3px;
      background-color: #00998d;
      left: 0;
    }
  }
}
</style>